﻿<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>我和你的爱情故事</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <style type="text/css">
        @font-face {
            font-family: digit;
            src: url('digital-7_mono.ttf') format("truetype");
        }
    </style>
    <link href="style/default.css" type="text/css" rel="stylesheet">
    <script type="text/javascript" src="style/jquery.js"></script>
    <script type="text/javascript" src="style/garden.js"></script>
    <script type="text/javascript" src="style/functions.js"></script>
    <!-- Compiled and minified CSS -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.99.0/css/materialize.min.css">
</head>

<body>
    <div id="mainDiv" class="container">
        <div class="header row" style="height:400px;text-align:center;margin-top:40px">
            <audio src="bgsound.m4a" autoplay loop controls style="width:60%;height:100px">
                <p>If you are reading this, it is because your browser does not support the audio element.</p>
            </audio>
        </div>
        <div class="row">
            <div class="col m8 offset-m2" id="code">
                <span class="comments">/***</span><br />
                <span class="space"/><span class="comments">* 2017年，我们相继毕业于宾州州立大学，我们都拿到了计算机科学的学位，</span><br />
                <span class="space"/><span class="comments">* 我决定用代码来向你表达我们之间的爱情故事。</span><br />
                <span class="space"/><span class="comments">***/</span><br />
                Boy i = <span class="keyword">new</span> Boy(<span class="string">"隋昊君"</span>);<br />
                Girl u = <span class="keyword">new</span> Girl(<span class="string">"李梦婕"</span>);<br />
                <span class="comments">// 2016年10月13日，你去考GRE，那天我喝醉了大胆地对你说：“不要离开我好不好”。</span><br />
                i.love(u);<br />
                <span class="comments">// 2016年10月14日，我们看完电影，早上去吃waffle shop，你鼓起勇气告诉我你也爱我。</span><br />
                u.love(i);<br />
                <span class="comments">// 从那天起，我们有过许多开心的时光，也有过让彼此心痛的时光。</span><br />
                <span class="keyword">var</span> [happy, heart_break]=u.liveWith(i);<br />
                $("body").append([happy, heart_break]);<br />
                <span class="comments">// 我对你的爱让你脸上挂满了笑容。</span><br />
                i.takeCareOf(u);<br />
                <span class="comments">// 对我太多太多无理的要求你也是宽容的忍受，但每一次地忍受我知道你一定也不好受。</span><br />
                u.bearWith(i);<br />
                <span class="comments">// 想让你开心幸福，我一直在改变着自己。</span><br />
                <span class="keyword">var</span> things[]=u.happyWith();<br />
                i.change(things);<br />
                <span class="comments">// 和你在一起之后我享受着你给我的爱，也迷上了打游戏，渐渐地变得不像原来那么勤奋了。</span><br />
                i.procrastinate();<br />
                <span class="comments">// 我也知道生活中各种细节都做得不够好，点滴之间无形中让你失望了，我也发现了你渐渐对我的冷淡。</span><br />
                <span class="keyword">boolean</span> isAccept = <span class="keyword">false</span>;<br />
                i.destroy();<br />
                <span class="comments">// 现在我要痛改前非。之前的我绝不是你说的那句“Merry me”可以配得上的人。但现在我明白了如何去爱你，怎么去给你真正的爱情。真正爱一个人需要给予对方所有的信任，不要在拥有对方的爱的时候还凭着自己的自私去要求对方。曾经的我自私，耍小孩子脾气，不成熟。现在的我每天都在改变着自己，去成为你心中想要我成为的那个人。</span><br />
                believe = "我会给你男朋友应该给到的关心，而不是过分的占有欲。"<br />
                caring = "即使不开心也要时刻注意到你的感受，把你的想法放在第一位。"<br />
                others = "我会尽我一切的努力让你和你的身边的人看到我的改变，让你知道我是一个可以靠得住，有爱心的男朋友。"<br />
                things = [believe, caring, others]<br />
                i.set(things);<br />
                <span class="keyword">while</span> (isAccept) {<br />
                <span class="placeholder"/>i.waitFor(u);<br />
                <span class="placeholder"/><span class="comments">// 我知道做出这个决定对你是那么的重要</span><br />
                <span class="placeholder"/><span class="comments">// 但我会用尽我所有的力量去好好疼爱你</span><br />
                <span class="placeholder"/>isAccept = u.thinkOver();<br />
                }<br />
                <span class="comments">// 我们会一直幸福的生活下去。</span><br />
                u.accept(i);<br />
                u.liveHappilyWith(i);<br />
                <br />
                <br />
                <span class="comments">// 我明白生活不像程序这么简单，有了前置条件就能达到后置条件。</span><br />
                <span class="comments">// 生活上的事情不是讲道理，而是两个人共同去了解对方，共同去努力。</span><br />
                <span class="comments">// 我知道我所说的改变只是很小的一部分，还有很多地方需要我去努力。</span><br />
                <span class="comments">// 请你相信，我给的爱，值得你爱。</span><br />
            </div>
        </div>
        <div id="content" class="row" style="margin-top:650px">
            <div id="loveHeart" class="col s12">
                <canvas id="garden"></canvas>
                <div id="words">
                    <div id="messages">
<center>
</center>
                    亲爱的，这是我们相爱在一起的时光。
                    <div id="elapseClock" style="display:none"></div>
                    <a href='javascript:void(0)' id="accept">点我点我点我。</a>
                    </div>
                    <div id="loveu">
                    爱你直到永远。<br/>
                    <div class="signature">- 隋昊君</div>
                </div>
            </div>
        <!-- </div> -->
        </div>

    </div>
    <script type="text/javascript">
        var offsetX = $("#loveHeart").width() / 2;
        var offsetY = $("#loveHeart").height() / 2 - 55;

        if (!document.createElement('canvas').getContext) {
            var msg = document.createElement("div");
            msg.id = "errorMsg";
            msg.innerHTML = "Your browser doesn't support HTML5!<br/>Recommend use Chrome 14+/IE 9+/Firefox 7+/Safari 4+";
            document.body.appendChild(msg);
            $("#code").css("display", "none")
            $("#copyright").css("position", "absolute");
            $("#copyright").css("bottom", "10px");
            document.execCommand("stop");
        } else {
            setTimeout(function () {
                adjustWordsPosition();
                startHeartAnimation();
            }, 80000);

            $("#accept").click(function(){
                $(this).hide();
                $("#elapseClock").show();
                var together = new Date(2016,9,14);
                timeElapse(together);
                setInterval(function () {
                    timeElapse(together);
                }, 500);
            })
            adjustCodePosition();
            $("#code").typewriter();
        }
    </script>

    <script>
        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
        (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

        ga('create', 'UA-81403004-2', 'auto');
        ga('send', 'pageview');
    </script>
</body>
</html>
